<script setup lang="ts">
	import BasicButton from '@/components/BasicButton/index.vue';
	import AppProvider from '@/components/AppProvider/index.vue';
	import { CURRENT_PLATFORM, PLATFORMS } from '@/enums/platformEnum';
	import { judgePlatform } from '@/utils/platform';
	import Iconify from '@/components/Iconify/index.vue';
	import { getEnvValue } from '@/utils/env';

	const appTitle = getEnvValue<string>('VITE_APP_TITLE');

	const title = ref(appTitle);

	const platform = CURRENT_PLATFORM;

	const isVue3 = judgePlatform(PLATFORMS.VUE3);

	const router = useRouter();

	const handleInterview = () => {
		router.pushTab({ path: '/pages/demo/index' });
	};
</script>
<template>
	<AppProvider>
		<view class="content">
			<view class="uni-margin-wrap">
				<swiper class="swiper" circular :indicator-dots="true" :autoplay="true" :interval="2000"
					:duration="500">
					<swiper-item>
						<view class="swiper-item _u_bg-red">A</view>
					</swiper-item>
					<swiper-item>
						<view class="swiper-item _u_bg-green">B</view>
					</swiper-item>
					<swiper-item>
						<view class="swiper-item _u_bg-blue">C</view>
					</swiper-item>
				</swiper>
			</view>
			<view class="_u_flex _u_flex-col _u_mt-3 _u_px-4">
				<text class="_u_font-500 _u_text-2xl">欢迎使用Master</text>
				<view class="_u_mt-3 _u_mb-5 _u_text-sm _u_color-truegray-500">
					感谢你参与本场面试。首先，你登录的手机号已收到企业发送的面试邀请或拥有邀请码，如果有，请点击下面按钮</view>
				<button class="_u_mb-4 _u_text-white btn-bg" @click="handleInterview">跳转demo</button>
			</view>
			<view class="bt-tip _u_flex _u_flex-col _u_text-xs _u_color-truegray-500">
				<text class="_u_flex _u_justify-center">请使用手机来进行全程面试，以保证顺利进行</text>
				<text class="_u_flex _u_justify-center">(面试前，请把手机微信升级到最新版本)</text>
			</view>
		</view>
	</AppProvider>
</template>
<style lang="scss">
	page {
		background-color: #fff;
	}

	.content {
		display: flex;
		flex-direction: column;
	}

	.uni-margin-wrap {
		width: 690rpx;
		width: 100%;
	}

	.swiper {
		height: 300rpx;
	}

	.swiper-item {
		display: block;
		height: 300rpx;
		line-height: 300rpx;
		text-align: center;
	}

	.btn-bg {
		background-color: #007aff;
	}

	.bt-tip {
		position: fixed;
		width: 100%;
		bottom: calc(var(--window-bottom) + 10px);
	}
</style>